<template>
	<view class="content">
		<view class="tuijian" v-if="orderlist != ''">
			<view class="tuijian_con"  v-for="(item, i) in orderlist" :key="i" v-if="orderlist != ''" >
				<view class="sec_center" >
					<view class="left" @click.stop="checkStatus(i)" v-if="status == 0">
						<image :src="urls + '/static/user/lcheck.png'" v-if="item.check==false"></image>
						<image :src="urls + '/static/user/lchecks.png'"  v-else></image>
					</view>
					<view class="center"><image :src="item.prize_icon"></image></view>
					<view class="right">
						<text class="name">{{ item.prize_name }}</text>
						<text class="cont"  >价值：￥{{item.price}}</text>
					</view>
				</view>
				<!-- <view class="bom_price" v-if="item.check==true">
					<text>价格</text>
					<input type="number" placeholder="请输入商品价格" v-model="item.value"/>
				</view> -->
			</view>
		</view>
		
		<view class="emptya flex-column flex-c-c" v-if="orderlist == ''">
			<!-- <image src="https://pd.pdaxiang.com/upload/static/index/null.png"></image> -->
			<text class="size-32 color-h">暂无数据</text>
		</view>
		<u-popup mode="center" v-model="ckdStatus" border-radius="20">
			<view class="cdkey_cont">
				<view class="ckd_top">
					<view class="title">
						请输入赠送标题
					</view>
					<textarea v-model="title" placeholder="请输入" />
				</view>
				<view class="cdk_btn">
					<view class="flexs" @click="quxiao()">
						<text>取消</text>
					</view>
					<view class="flexs" @click="submitZengsong">
						<text>确定</text>
					</view>
				</view>
			</view>
		</u-popup>
		<u-modal v-model="Shouhuoshow" content="确定收货吗?" :show-cancel-button="true" @confirm="payConfirm"></u-modal>
		<view class="footer" v-if="status == 0">
			<view class="top" @click="quanxuan">
				<image :src="urls + '/static/user/lcheck.png'" v-if="allStatus==false"></image>
				<image :src="urls + '/static/user/lchecks.png'"  v-else></image>
				<text>全选</text>
			</view>
			<view class="bottom">
				<view class="left" @click="bottomClick(1)">
					已选{{selectNumber}}件，确认赠送
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	data() {
		return {
			ckdStatus:false,//赠送弹窗
			zengsongStatus:false,//赠送确认弹窗状态
			urls: this.$configs.urls,
			Shouhuoshow:false,
			orderlist: [],
			checkIndex: 0,
			page:1,
			status:0,
			order_id:"",//订单id
			jimaiyulan:{},
			allStatus:false,
			total_recovery_price:"",
			title:"",
			selectNumber:0
		};
	},
	onLoad(option) {
		//从发货进来
		if(option.type==1){
			this.checkIndex = 1;
			this.status = 1;
			this.getlist()
		}
	},
	onShow() {
		this.getlist()
	},
	onPullDownRefresh() {
		this.page=1;
		this.orderlist = []
		this.getlist();
		setTimeout(function() {
			uni.stopPullDownRefresh();
		}, 1000);
		 clearTimeout();
	},
	onReachBottom() {
		this.page++;
		this.getlist(2);
	},
	onHide() {
		this.page=1;
		this.zongjia = 0;
		this.ckdStatus = false;
		this.selectNumber = 0
		this.allStatus = false;
		this.$refs.jimaiStatus.close()
	},
	methods: {
		quxiao(){
			this.zongjia = 0;
			this.ckdStatus = false;
		},
		//确定赠送
		submitZengsong(){
			let order_idarr = this.getCarIds()
			// if(this.title==''){
			// 	uni.showToast({
			// 	    title: '请选择赠送标题',
			// 	    icon: 'none'
			// 	})
			// 	return
			// }
			let data = {
				order_list:order_idarr,
				title:this.title
			}
			this.$Request.post(this.$api.order.sellSubmitzs,data).then(res => {
				this.ckdStatus = false;
				uni.showToast({
					title:res.msg,
					duration:1500,
					icon:"none"
				})
				this.allStatus = false
				this.selectNumber = 0
				this.zongjia = 0
				setTimeout(()=>{
					this.page = 1;
					this.getlist()
				},1000)
				 clearTimeout();
			});
		},
		quanxuan(){
			this.allStatus = !this.allStatus;
			var orderlist = this.orderlist;
			for (let i = 0; i < orderlist.length; i++) {
				if (this.allStatus) {
					orderlist[i].check = true;
				} else {
					orderlist[i].check = false;
				}
			}
			if(this.getCarIds()==false){
				this.selectNumber = 0
			}else{
				this.selectNumber = this.getCarIds().length
			}
		},
		//底部按钮点击
		bottomClick(){
			if(this.getCarIds()==false){
				uni.showToast({
				    title: '请选择商品',
				    icon: 'none'
				})
				return
			}
			let order_idarr = this.getCarIds()
			for (let i = 0; i < order_idarr.length; i++) {
				if(order_idarr[i].price==undefined){
					uni.showToast({
					    title: '请输入价格',
					    icon: 'none'
					})
					return
				}
			}
			this.ckdStatus = true;
		},
		//新寄卖预览
		gethuishouyulan(){
			let order_idarr = this.getCarIds()
			if(order_idarr==false){
				uni.showToast({
				    title: '请选择商品',
				    icon: 'none'
				})
				return
			}
			let data = {
				order_id:order_idarr
			}
			this.$Request.post(this.$api.order.newExchangePreview,data).then(res => {
				this.total_recovery_price = res.data.total_recovery_price
			});
		},
		//确认收货
		payConfirm(){
			let data = {
				order_id:this.order_id
			}
			this.$Request.post(this.$api.order.confirm,data).then(res => {
				uni.showToast({
					title:res.msg,
					duration:1500,
					icon:"none"
				})
				this.checkIndex = 3;
				this.page=1;
				this.status = 3;
				this.orderlist = []
				this.getlist();
			});
		},
		querenshouhuo(order_id){
			this.order_id = order_id;
			this.Shouhuoshow = true;
		},
		getlist(type){
			let data = {
				page:this.page,
				status:this.status
			}
			uni.showLoading({
				title:"加载中..."
			})
			this.$Request.get(this.$api.order.sellPreviewIndex,data).then(res => {
				uni.hideLoading()
				if(type==2){
					this.orderlist = this.orderlist.concat(res.data.list);
				}else{
					this.orderlist = res.data.list;
				}
			});
		},
		//多选
		checkStatus(shopIndex){
			var that = this;
			let orderlist = that.orderlist;
			if (orderlist[shopIndex].check == false) {
			    orderlist[shopIndex].check = true;
			} else {
			    orderlist[shopIndex].check = false;
			}
			for (let i = 0; i < orderlist.length; i++) {
			    var indexNum = 0;
				if (orderlist[i].check == false) {
				    orderlist[i].check = false;
				} else {
				    indexNum = indexNum + 1;
				    if (indexNum > 0 && orderlist[i].length == indexNum) {
				        orderlist[i].check = true;
				    }
				}
			}
			that.setAllSel();
		},
		setAllSel: function() { //是否全选
		    let shopNum = 0;
		    for (let i = 0; i < this.orderlist.length; i++) {
		        if (this.orderlist[i].check == true) {
		            shopNum = shopNum + 1;
		        }
		    }
		    if (shopNum == this.orderlist.length && shopNum > 0) {
		        this.allStatus = true;
		    } else {
		        this.allStatus = false;
		    }
			if(this.getCarIds()==false){
				this.selectNumber = 0
			}else{
				this.selectNumber = this.getCarIds().length
			}
		},
		getCarIds() { //获取要结算的商品
		    var that = this;
		    var orderlist = that.orderlist;
		    var haveSel = [];
		    for (let i = 0; i < orderlist.length; i++) {
		       if (orderlist[i].check == true) {
				   let obj = {
					   order_id:orderlist[i].order_id,
					   price:orderlist[i].value
				   }
		           haveSel.push(obj);
		       }
		    }
		    if (haveSel.length == 0) {
		        return false;
		    }
		    // let cartIds = haveSel.join(',');
		    return haveSel;
		},
		goFahuo(){
			let order_idarr = this.getCarIds()
			if(order_idarr==false){
				uni.showToast({
				    title: '请选择商品',
				    icon: 'none'
				})
				return
			}
			uni.navigateTo({
				url:"/luckdraw/pages/shopfahuo?order_id=" + this.order_id  + '&order_idarr=' + JSON.stringify(order_idarr)
			})
		},
		//打开寄卖弹窗
		openjimai(){
			this.$refs.jimaiStatus.close()
		},
		classification(i) {
			this.page = 1;
			this.checkIndex = i;
			this.status = i;
			this.orderlist = []
			this.allStatus = false;
			this.getlist()
		},
		jimaiAndfahuo(order_id){
			this.order_id = order_id
			let data = {
				order_id:this.order_id
			}
			this.$Request.get(this.$api.order.exchangePreview,data).then(res => {
				this.jimaiyulan = res.data
			
			});
		},
		guanbipop(){
			this.$refs.jimaiStatus.close()
		},
	}
};
</script>

<style lang="scss" scoped>
.content {
	min-height: 100vh;
	background: #ffffff;
	.bom_price{
		display: flex;
		align-items: center;
		text{
			font-size: 32rpx;
			font-family: PingFang SC;
			font-weight: bold;
			color: #333333;
			margin-right: 20rpx;
		}
		input{
			width: 400rpx;
			height: 50rpx;
			background: #FFFFFF;
			border: 1px solid #707070;
			border-radius: 10rpx;
			font-size: 24rpx;
			font-family: PingFang SC;
			font-weight: 400;
			color: #999999;
			padding-left: 20rpx;
		}
	}
	.cdkey_cont{
		width: 580rpx;
		min-height: 400rpx;
		background: #FFFFFF;
		border-radius: 20rpx;
		.cdk_btn{
			width: 580rpx;
			display: flex;
			justify-content: space-between;
			position: absolute;
			bottom: 0;
			view{
				width: 50%;
				height: 78rpx;
				font-size: 30rpx;
				font-family: PingFang SC;
				font-weight: 400;
				color: #666666;
				border-top: 1px solid #E3E3E3;
			}
			view:nth-child(2){
				color: #fff;
				background: #27438B;
				border-left: 1px solid #E3E3E3;
			}
		}
		.ckd_top{
			padding: 20rpx;
			padding-top: 30rpx;
			display: flex;
			flex-direction: column;
			align-items: center;
			textarea{
				width: 532rpx;
				height: 180rpx;
				background: #F8F8F8;
				border-radius: 10rpx;
				padding:20rpx 20rpx;
				box-sizing: border-box;
			}
			.title{
				font-size: 30rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #333333;
				opacity: 1;
				margin-bottom: 40rpx;
			}
		}
		
	}
	.footer{
		position: fixed;
		bottom: 0;
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 750rpx;
		padding: 0 20rpx;
		box-shadow: 0px 3rpx 10rpx rgba(0, 0, 0, 0.16);
		background: #FFFFFF;
		z-index: 50;
		.top{
			height: 56rpx;
			background: #FFFFFF;
			display: flex;
			align-items: center;
			box-sizing: border-box;
			image{
				width: 44rpx;
				height: 44rpx;;
			}
			text{
				font-size: 29rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #282828;
				margin-left: 20rpx;
			}
		}
		.bottom{
			.left{
				width: 374rpx;
				height: 100rpx;
				background: #27438B;
				display: flex;
				justify-content: center;
				align-items: center;
				font-size: 28rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: white;
				border: 2rpx solid #FFFFFF;
				border-radius: 20rpx;
			}
		}
	}
	
	.checkNav {
		color: #fd8e1b !important;
		border-bottom: 2rpx solid #fd8e1b !important;
	}
	.tuijian {
		background: #ffffff;
		padding-top: 20rpx;
		padding-bottom: 120rpx;
		position: relative;
		.sec_right{
			position: absolute;
			right: 40rpx;
			top: 40rpx;
			text{
				font-size: 24rpx;
				font-family: PingFang SC;
				font-weight: 800;
				color: #000000;
			}
		}
		.sec_bottom {
			.view_title{
				font-size: 24rpx;
				font-family: PingFang SC;
				font-weight: 500;
				color: #000000;
			}
			.bom {
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: space-between;
				margin-top: 22rpx;
				.left {
					display: flex;
					align-items: center;
					text:nth-child(1) {
						font-size: 24rpx;
						font-family: PingFang SC;
						font-weight: 500;
						color: #000000;
						max-width: 240rpx;
						word-break: break-all;
						text-overflow: ellipsis;
						overflow: hidden;
						display: -webkit-box;
						-webkit-line-clamp: 1;
						-webkit-box-orient: vertical;
					}
				}
				.right {
					font-size: 29rpx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #ffffff;
					text-align: center;
					line-height: 24rpx;
					background: #fd8e1b;
					border-radius: 10rpx;
					padding: 8rpx 26rpx 8rpx 26rpx;
				}
			}
		}
		.tuijian_con {
			width: 710rpx;
			margin: 0 auto;
			padding: 20rpx;
			margin-bottom: 10rpx;
			border-radius: 20rpx;
			box-shadow: 0px 3rpx 11rpx rgba(0, 0, 0, 0.16);
			.sec_center {
				width: 710rpx;
				margin: 0 auto;
				// margin-top: 20rpx;
				display: flex;
				align-items: center;
				.left{
					image{
						width: 44rpx;
						height: 44rpx;
						margin-right: 20rpx;
					}
				}
				.center {
					padding: 10rpx 0 10rpx 0;
					image {
						width: 240rpx;
						height: 206rpx;
						border-radius: 10rpx;
					}
				}
				.right {
					margin-left: 20rpx;
					display: flex;
					flex-direction: column;
					justify-content: space-around;
					padding: 0 20rpx 0 0;
					box-sizing: border-box;
					.title {
						display: flex;
						align-items: center;
						text:nth-child(1) {
							font-size: 29rpx;
							font-family: PingFang SC;
							font-weight: bold;
							color: #282828;
						}
						text:nth-child(2) {
							font-size: 29rpx;
							font-family: PingFang SC;
							font-weight: bold;
							color: #fd8e1b;
						}
					}
					.name {
						font-size: 28rpx;
						font-family: PingFang SC;
						font-weight: 400;
						color: #333333;
						margin-top: 6rpx;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 2;
						text-align: justify;
						overflow: hidden;
					}
					.cont {
						font-size: 28rpx;
						font-family: PingFang SC;
						font-weight: 500;
						color: #F34A4A;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 2;
						text-align: justify;
						overflow: hidden;
						padding-right: 20rpx;
						box-sizing: border-box;
						margin-top: 40rpx;
					}
					.bom {
						min-width: 320rpx;
						display: flex;
						align-items: center;
						justify-content: space-between;
						margin-top: 2rpx;
						.left {
							display: flex;
							align-items: center;
							text:nth-child(1) {
								font-size: 24rpx;
								font-family: PingFang SC;
								font-weight: 500;
								color: #000000;
							}
						}
						.right {
							font-size: 29rpx;
							font-family: PingFang SC;
							font-weight: bold;
							color: #ffffff;
							text-align: center;
							line-height: 24rpx;
							background: #fd8e1b;
							border-radius: 10rpx;
							padding: 16rpx 26rpx 16rpx 26rpx;
						}
					}
				}
			}
		}
	}
	.header {
		width: 750rpx;
		.category-list {
			width: 100%;
			height: auto;
			display: flex;
			justify-content: flex-start;
			flex-flow: wrap;
			padding: 20rpx;
			.icon {
				display: flex;
				flex-flow: wrap;
				justify-content: center;
				font-size: 28rpx;
				margin-right: 50rpx;
				view {
					width: 100%;
					display: flex;
					justify-content: center;
					font-size: 28rpx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #717171;
				}
			}
		}
	}
}
</style>
